<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>支付宝支付</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <h1>支付宝支付示例</h1>

    <!-- 支付按钮 -->
    <button id="payButton">立即支付</button>

    <!-- 隐藏的支付表单 -->
    <form id="payForm" method="get" action="" style="display: none;">
        <!-- 动态填充支付表单内容 -->
    </form>

    <script>
        // 点击支付按钮时触发
        $('#payButton').click(function () {
            // 发送 AJAX 请求获取支付表单
            $.ajax({
                url: 'http://localhost:8080/alipay/pay/6898',  // 示例金额为 100
                type: 'GET',
                success: function (response) {
                    // 将支付表单插入到页面中
                    $('#payForm').attr('action', response.formAction);
                    $('#payForm').html(response.formContent);

                    // 提交表单
                    $('#payForm').submit();
                },
                error: function (error) {
                    console.error('获取支付表单失败:', error);
                }
            });
        });
    </script>
</body>
</html>
